<template>
  <div class="dashboard-container">
    <div class="app-container">
      <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleClick">
        <el-menu-item index="2">初审审核</el-menu-item>
        <el-menu-item index="3">复审审核</el-menu-item>
        <el-menu-item index="7">审核通过</el-menu-item>
        <el-menu-item index="4">已完成</el-menu-item>
        <el-menu-item index="6">未通过</el-menu-item>
        <el-menu-item index="5">已取消</el-menu-item>
      </el-menu>
      <!-- 搜索筛选 -->
      <el-row :gutter="10" style="margin-top:20px">
        <el-col :span="3.5">
          <el-date-picker
            v-model="query.created_start"
            type="datetime"
            placeholder="申请时间"
            value-format="yyyy-MM-dd"
            style="width:100%"
          />
        </el-col>
        <el-col :span="3.5">
          <el-date-picker
            v-model="query.created_end"
            type="datetime"
            placeholder="申请时间截止"
            value-format="yyyy-MM-dd"
            style="width:100%"
          />
        </el-col>
        <el-col :span="3">
          <el-button type="primary" icon="el-icon-search" @click="search">{{ $t('button.search') }}</el-button>
        </el-col>
      </el-row>
      <!-- 数据表 -->
      <el-table v-loading="downloadLoading" border :data="list" max-height="500px" style="margin-top: 20px;">
        <el-table-column label="ID" align="center" sortable width="60" prop="id" />
        <el-table-column label="申请时间" align="center" prop="passengers" width="180">
          <template slot-scope="{row}">
            {{ row.created_at|timeStanp }}
          </template>
        </el-table-column>
        <el-table-column label="申请金额" align="center" prop="money">
          <template slot-scope="{row}">
            {{ row.money }}元
          </template>
        </el-table-column>
        <el-table-column label="申请企业" align="center" prop="companyname" width="240" />
        <el-table-column label="硕士数量" align="center" prop="master" />
        <el-table-column label="博士数量" align="center" prop="doctor" />
        <el-table-column label="初审状态" align="center" prop="preliminary">
          <template slot-scope="{row}">
            <el-tag :type="row.preliminary|statusTag">
              {{ row.preliminary|auditingStatus }}
            </el-tag>
          </template>
        </el-table-column>
        <el-table-column label="复审状态" align="center" prop="status_b">
          <template slot-scope="{row}">
            <el-tag :type="row.status_b|statusTag">
              {{ row.status_b|auditingStatus }}
            </el-tag>
          </template>
        </el-table-column>
        <el-table-column label="状态" align="center" prop="status">
          <template slot-scope="{row}">
            <el-tag :type="row.status|statusFilter">
              {{ row.status|trafficStatus }}
            </el-tag>
          </template>
        </el-table-column>
        <el-table-column :label="$t('table.actions')" width="280" align="center" fixed="right">
          <template slot-scope="{row}">
            <el-button type="primary" icon="el-icon-edit" size="mini" :disabled="!checkPermission('baseInternship-show')" @click="addRole('edit',row)">查看/审核</el-button>
            <el-button v-if="row.status===7" type="warning" icon="el-icon-finished" size="mini" :disabled="!checkPermission('baseInternship-wan')" @click="btnCompletion(row)">申报完结</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <!-- 分页 -->
    <el-row type="flex" align="middle" style="margin-left: 20px;">
      <el-pagination background layout="total,prev,pager,next" :total="count" :page-size="query.limit" :current-page="query.page" @current-change="changPage" />
    </el-row>
    <!-- 添加 -->
    <el-dialog :visible="showDialog" title="实习人员信息" top="40px" @close="btnCanle" @opened="openDialogF">
      <div class="shopOrder-dialog">
        <el-form ref="ruleForm" :model="formData" :rules="rules" label-width="150px">
          <el-form-item label="姓名" prop="full_name">
            <el-input v-model="formData.full_name" style="width: 50%;" disabled />
          </el-form-item>
          <el-form-item label="手机号" prop="phone">
            <el-input v-model="formData.phone" style="width: 50%;" disabled />
          </el-form-item>
          <el-form-item label="有效身份证" prop="id_card">
            <el-input v-model="formData.id_card" style="width: 50%;" disabled />
          </el-form-item>
          <el-form-item label="身份证正面" prop="id_card_left">
            <ImageUpload ref="idCardLeftPhoto" :is-true="true" />
          </el-form-item>
          <el-form-item label="身份证反面" prop="id_card_right">
            <ImageUpload ref="idCardRightPhoto" :is-true="true" />
          </el-form-item>
          <el-form-item label="学校类型" prop="school_type">
            <el-radio-group v-model.number="formData.school_type" disabled>
              <el-radio :label="1">国内</el-radio>
              <el-radio :label="2">国外</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item v-if="formData.school_type===1" label="学校所在城市">
            <el-select v-model="formData.province" disabled style="margin-right: 10px;" @change="provincedata">
              <el-option v-for="(item,index) in provinceList" :key="index" :label="item.fullname" :value="item.fullname" />
            </el-select>
            <el-select v-model="formData.city" disabled @change="citydata">
              <el-option v-for="(item,index) in city" :key="index" :label="item.fullname" :value="item.fullname" />
            </el-select>
          </el-form-item>
          <el-form-item v-if="formData.school_type===2" label="学校所在国家" prop="province">
            <el-input v-model="formData.province" style="width: 50%;" :placeholder="$t('table.enterThe')+'学校所在国家'" disabled />
          </el-form-item>
          <el-form-item label="在读学校" prop="school">
            <el-select v-model="formData.school" filterable placeholder="请选择在读学校" :filter-method="customFilter" style="width:50%" disabled>
              <el-option v-for="item in filteredOptions" :key="item.id" :value="item.name" />
            </el-select>
          </el-form-item>
          <el-form-item label="学历" prop="qualification">
            <el-select v-model.number="formData.qualification" placeholder="请选择学历">
              <el-option v-for="item in qualification" :key="item.id" :label="item.name" :value="item.id" disabled />
            </el-select>
          </el-form-item>
          <el-form-item label="学历证书" prop="qualification_img">
            <ImageUpload ref="qualificationImgPhoto" :is-true="true" />
          </el-form-item>
          <el-form-item label="在读证明材料" prop="prove">
            <ImagesListUpload ref="provePhoto" :is-true="true" />
          </el-form-item>
          <el-form-item label="实习岗位" prop="position">
            <el-input v-model="formData.position" style="width: 50%;" disabled />
          </el-form-item>
          <el-form-item label="实习开始时间" prop="start_at">
            <el-date-picker v-model.number="formData.start_at" editable type="date" disabled format="yyyyMMdd" value-format="timestamp" />
          </el-form-item>
          <el-form-item label="实习结束时间" prop="start_at">
            <el-date-picker v-model.number="formData.end_at" editable type="date" disabled format="yyyyMMdd" value-format="timestamp" />
          </el-form-item>
          <el-form-item label="实习时长" prop="duration">
            <el-input v-model="formData.duration" style="width: 15%;" disabled /> 个月
          </el-form-item>
          <el-form-item label="补贴时长" prop="subsidy_duration">
            <el-input v-model="formData.subsidy_duration" style="width: 15%;" disabled /> 个月
          </el-form-item>
          <el-form-item label="补贴金额" prop="money">
            <el-input v-model="formData.money" style="width: 15%;" disabled /> 元
          </el-form-item>
          <el-form-item label="实习佐证" prop="practice_img">
            <ImagesListUpload ref="practice_img" :is-true="true" />
          </el-form-item>
        </el-form>
      </div>
      <div v-if="traffic_data.status<3" slot="footer" class="dialog-footer">
        <el-button @click="btnCanle">{{ $t('button.cancel') }}</el-button>
      </div>
    </el-dialog>
    <RightPanel ref="panel" :click-not-close="true" :width="80">
      <div class="base">
        <div class="logo"><img alt="" :src="company.logo_url"></div>
        <div class="info">
          <div class="title">
            <div class="name">{{ company.companyname }}</div>
            <div class="qcc_box" />
          </div>
          <div class="details">
            <el-row class="line">
              <el-col :span="8">
                <label class="line_label">基地认证：</label>
                <el-tag v-if="company.is_practice===0" type="info">未认证</el-tag>
                <el-tag v-if="company.is_practice===1" type="success">已认证</el-tag>
                <el-tag v-if="company.is_practice===2" type="danger">未通过</el-tag>
                <el-tag v-if="company.is_practice===3" type="warning">审核中</el-tag>
              </el-col>
              <el-col :span="8">
                <label class="line_label">社会信用代码：</label>
                <span class="text"> {{ company.credit_code }} </span>
              </el-col>
              <el-col :span="8">
                <label class="line_label">企业性质：</label>
                <span class="text"> {{ company.nature_name }}</span>
              </el-col>
            </el-row>
            <el-row class="line">
              <el-col :span="8">
                <label class="line_label">所属行业：</label>
                <span class="text"> {{ company.trade_name }} </span>
              </el-col>
              <el-col :span="8">
                <label class="line_label">企业规模：</label>
                <span class="text"> {{ company.scale_name }} </span>
              </el-col>
              <el-col :span="8">
                <label class="line_label">所属地区：</label>
                <span class="text">{{ company.district1_name }}{{ company.district2_name }}{{ company.district_name }}</span>
              </el-col>
            </el-row>
          </div>
        </div>
      </div>
      <div class="tab_box">
        <el-tabs v-model="activeName">
          <el-tab-pane label="审核信息" name="0">
            <div class="clientInfo_wrapper">
              <el-row>
                <el-col :span="15">
                  <div class="tables">
                    <div class="title_t">审核信息</div>
                    <div class="table_content">
                      <el-form ref="ruleForm" :model="traffic_data" label-width="140px">
                        <el-form-item label="申报金额" prop="starting_station">
                          <el-row>
                            <el-col :span="17">
                              <el-input v-model="traffic_data.money" style="width: 50%;" placeholder="申报金额" disabled />
                            </el-col>
                            <el-col :span="7">
                              <el-switch v-model="traffic_data.is_money" active-color="#13ce66" inactive-text="材料是否符合要求" />
                            </el-col>
                          </el-row>
                        </el-form-item>
                        <el-form-item label="大学生实习花名册" prop="roster">
                          <el-row>
                            <el-col :span="17">
                              <ImagesListUpload ref="roster" :is-true="true" />
                            </el-col>
                            <el-col :span="7">
                              <el-switch v-model="traffic_data.is_roster" active-color="#13ce66" inactive-text="材料是否符合要求" />
                            </el-col>
                          </el-row>
                        </el-form-item>
                      </el-form>
                    </div>
                  </div>
                </el-col>
                <el-col :span="9">
                  <div class="tables">
                    <el-card class="box-card" style="margin-top: 30px;">
                      <div slot="header" class="clearfix">
                        <span>初审审核</span>
                        <el-button v-if="traffic_data.preliminary===0" :disabled="!checkPermission('baseInternship-chu')" style="float: right;" size="mini" type="primary" @click="btnOk(1)">确定</el-button>
                      </div>
                      <div style="margin-top: 30px;">
                        <el-form ref="ruleForm" :model="traffic_data" label-width="100px">
                          <el-form-item label="审核操作：" prop="preliminary">
                            <el-radio-group v-model.number="preliminary" :disabled="traffic_data.preliminary>0">
                              <el-radio :label="0">待审核</el-radio>
                              <el-radio :label="1">通过</el-radio>
                              <el-radio :label="2">拒绝</el-radio>
                            </el-radio-group>
                          </el-form-item>
                          <el-form-item v-if="preliminary===2" label="审核模版：">
                            <el-select :value="traffic_data.reason" :placeholder="$t('table.selectThe')+'模版'" style="width: 100%;" :disabled="traffic_data.preliminary>0" @change="selseChan">
                              <el-option v-for="(item,index) in modelList" :key="index" :value="item.reason" />
                            </el-select>
                          </el-form-item>
                          <el-form-item v-if="preliminary===2" label="原因：">
                            <el-input
                              v-model="traffic_data.reason"
                              type="textarea"
                              :rows="4"
                              placeholder="请输入原因"
                              :disabled="traffic_data.preliminary>0"
                            />
                          </el-form-item>
                          <el-form-item v-if="traffic_data.preliminary>0" label="审核人：">
                            <el-input v-model="traffic_data.mid_name" :disabled="traffic_data.preliminary>0" style="width: 50%;" />
                          </el-form-item>
                          <el-form-item v-if="traffic_data.preliminary>0" label="审核时间：">
                            <el-date-picker v-model.number="traffic_data.preliminary_at" disabled style="width: 50%;" type="date" format="yyyy-MM-dd HH:mm:ss" value-format="timestamp" />
                          </el-form-item>
                        </el-form>
                      </div>
                    </el-card>
                    <el-card v-if="traffic_data.preliminary===1" class="box-card" style="margin-top: 30px;">
                      <div slot="header" class="clearfix">
                        <span>复审审核</span>
                        <el-button v-if="traffic_data.status_b===0" :disabled="!checkPermission('baseInternship-fu')" style="float: right;" size="mini" type="primary" @click="btnOk(2)">确定</el-button>
                      </div>
                      <div style="margin-top: 30px;">
                        <el-form ref="ruleForm" :model="traffic_data" label-width="100px">
                          <el-form-item label="审核操作：" prop="Fstatus">
                            <el-radio-group v-model.number="Fstatus" :disabled="traffic_data.status_b>0">
                              <el-radio :label="0">待审核</el-radio>
                              <el-radio :label="1">通过</el-radio>
                              <el-radio :label="2">拒绝</el-radio>
                            </el-radio-group>
                          </el-form-item>
                          <el-form-item v-if="Fstatus===2" label="审核模版：">
                            <el-select :value="traffic_data.reason" :placeholder="$t('table.selectThe')+'类型'" style="width: 100%;" :disabled="traffic_data.status_b>0" @change="selseChan">
                              <el-option v-for="(item,index) in modelList" :key="index" :value="item.reason" />
                            </el-select>
                          </el-form-item>
                          <el-form-item v-if="Fstatus===2" label="原因：">
                            <el-input v-model="traffic_data.reason" type="textarea" :rows="4" placeholder="请输入原因" :disabled="traffic_data.status_b>0" />
                          </el-form-item>
                          <el-form-item v-if="traffic_data.status_b>0" label="审核人：">
                            <el-input v-model="traffic_data.fid_name" :disabled="traffic_data.status>0" style="width: 50%;" />
                          </el-form-item>
                          <el-form-item v-if="traffic_data.status_b>0" label="审核时间：">
                            <el-date-picker v-model.number="traffic_data.status_at" disabled style="width: 50%;" type="date" format="yyyy-MM-dd HH:mm:ss" value-format="timestamp" />
                          </el-form-item>
                        </el-form>
                      </div>
                    </el-card>
                  </div>
                </el-col>
              </el-row>
            </div>
          </el-tab-pane>
          <el-tab-pane label="实习人员清单" name="1">
            <div class="clientInfo_wrapper">
              <el-row>
                <el-col :span="24">
                  <div class="tables">
                    <div class="table_content">
                      <!-- 数据表 -->
                      <el-table border :data="internship_user" max-height="600px">
                        <el-table-column label="ID" align="center" sortable width="60" prop="id" fixed />
                        <el-table-column label="姓名" align="center" prop="full_name" width="100" fixed />
                        <el-table-column label="有效身份证" prop="id_card" width="190" align="center" />
                        <el-table-column label="实习岗位" align="center" prop="position" />
                        <el-table-column label="在读学校" align="center" prop="school" width="180" />
                        <el-table-column label="学历" align="center" prop="start_at" width="100">
                          <template slot-scope="{row}">
                            {{ row.qualification|qualificationType }}
                          </template>
                        </el-table-column>
                        <el-table-column label="实习开始时间" align="center" prop="start_at" width="140">
                          <template slot-scope="{row}">
                            {{ row.start_at|timeStanpYYMMDD }}
                          </template>
                        </el-table-column>
                        <el-table-column label="实习结束时间" align="center" prop="end_at" width="140">
                          <template slot-scope="{row}">
                            {{ row.end_at|timeStanpYYMMDD }}
                          </template>
                        </el-table-column>
                        <el-table-column label="实习时长" align="center" prop="duration" width="90" />
                        <el-table-column label="补贴时长" align="center" prop="subsidy_duration" width="90" />
                        <el-table-column label="补贴金额" align="center" prop="money" width="90" />
                        <el-table-column :label="$t('table.actions')" width="120" align="center" fixed="right">
                          <template slot-scope="{row}">
                            <el-button type="primary" icon="el-icon-edit" size="mini" @click="addRole('ren',row)">查看</el-button>
                          </template>
                        </el-table-column>
                      </el-table>
                    </div>
                  </div>
                </el-col>
              </el-row>
            </div>
          </el-tab-pane>
        </el-tabs>
      </div>
    </RightPanel>
  </div>
</template>
<script>
import { GetBaseInternship, GetSchool, GetBaseInternshipInfo, GetAttestModel, EditBaseInternship, BaseInternshipCompletion } from '@/api/user'
import user from '@/store/modules/user'
import province from '@/api/m_province'
export default {
  filters: {
    statusFilter(status) {
      const statusMap = {
        4: 'success',
        2: 'primary',
        3: 'warning',
        6: 'danger',
        5: 'info',
        7: 'success'
      }
      return statusMap[status]
    },
    statusTag(status) {
      const statusMap = {
        1: 'success',
        0: 'warning',
        2: 'danger',
        5: 'info'
      }
      return statusMap[status]
    }
  },
  data() {
    return {
      activeName: '0',
      activeIndex: '2',
      downloadLoading: false,
      list: [],
      count: 0,
      qualification: [
        { id: 1, name: '大专' },
        { id: 2, name: '本科' },
        { id: 3, name: '硕士' },
        { id: 4, name: '博士' }
      ],
      statusData: [
        { id: 3, name: '未知' },
        { id: 1, name: '是' },
        { id: 2, name: '否' }
      ],
      query: {
        bid: undefined,
        status: 2,
        created_start: '',
        created_end: '',
        page: 1,
        limit: 10
      },
      formData: {
        comid: undefined,
        city: '',
        id: undefined,
        full_name: '',
        province: '',
        school_type: 1,
        school: '',
        qualification: undefined,
        id_card_left: '',
        id_card_right: '',
        qualification_img: '',
        phone: '',
        bank: '',
        bank_no: '',
        bank_img: '',
        status: 0,
        status_img: '',
        start_at: undefined
      },
      rules: {},
      roleShowDialog: false,
      showDialog: false,
      permData: [],
      defaultProps: {
        label: 'name'
      },
      selectCheck: [], // 定义一个数组来接收 已经选中的节点
      roleId: undefined, // 用来记录分配角色的id
      provinces: [],
      provinceList: [],
      city: [],
      school: [],
      value: '',
      inputValue: '',
      filteredOptions: [],
      adminInfo: {},
      imgUrl: { url: '', name: '' },
      fileList: [],
      practice: {},
      internship_user: [],
      user_data: {},
      company: {},
      showDialogB: false,
      content: '',
      traffic_data: {},
      modelList: [],
      com_status: undefined,
      preliminary: undefined,
      Fstatus: undefined
    }
  },
  watch: {
    value(newVal) {
      const selectedOption = this.school.find(option => option.id === newVal)
      this.inputValue = selectedOption ? selectedOption.name : newVal
    }
  },
  created() {
    this.query.bid = parseInt(user.state.userInfo.bid)
    this.formData.comid = parseInt(user.state.userInfo.bid)
    this.getInter()
    this.getProvince()
  },
  methods: {
    // 申报完结
    async btnCompletion(row) {
      const one = {
        id: row.id
      }
      try {
        await this.$confirm('您确定要更改为完成状态！')
        // 调用新增接口
        await BaseInternshipCompletion(one)
        // 更新数据
        this.getInter()
        this.$message.success(this.$t('prompt.success'))
      } catch (error) {
        this.$message.error('失败！')
      }
    },
    // 点击确定时
    async btnOk(type) {
      try {
        let title = '您确定审核通过吗？'
        const one = {
          id: this.traffic_data.id,
          reason: this.traffic_data.reason,
          is_roster: this.traffic_data.is_roster,
          is_money: this.traffic_data.is_money,
          type: type
        }
        // 校验整个表单
        if (type === 1) {
          if (this.preliminary === 0) {
            return
          }
          if (this.preliminary === 2) {
            if (this.traffic_data.reason === '') {
              this.$message.error('审核理由不能为空！')
              return
            }
          }
          if (!this.traffic_data.is_roster || !this.traffic_data.is_money) {
            if (this.preliminary === 1) {
              this.$message.error('审核资料中未通过项，无法审核通过！')
              return
            }
          }
          one.mid = parseInt(user.state.userId)
          one.preliminary = this.preliminary
          if (this.preliminary === 1) {
            title = '您确定初审通过吗？'
          } else if (this.preliminary === 2) {
            title = '您确定初审不通过吗？'
          }
        } else {
          if (this.Fstatus === 0) {
            return
          }
          if (this.Fstatus === 2) {
            if (this.traffic_data.reason === '') {
              this.$message.error('审核理由不能为空！')
              return
            }
          }
          if (!this.traffic_data.is_roster || !this.traffic_data.is_money) {
            if (this.Fstatus === 1) {
              this.$message.error('审核资料中未通过项，无法审核通过！')
              return
            }
          }
          one.fid = parseInt(user.state.userId)
          one.status_b = this.Fstatus
          if (this.Fstatus === 1) {
            title = '您确定复审通过吗？'
          } else if (this.Fstatus === 2) {
            title = '您确定复审不通过吗？'
          }
        }

        await this.$confirm(title)
        // 调用新增接口
        await EditBaseInternship(one)
        // 更新数据
        this.getInter()
        this.$refs.panel.show = !this.$refs.panel.show
        this.$message.success(this.$t('prompt.success'))
      } catch (error) {
        this.$message.error('失败！')
      }
    },
    selseChan(e) {
      this.traffic_data.reason = e
    },

    // 获取实习人详情
    async getPracticeInfo(row) {
      this.activeName = '0'
      this.internship_user = []
      this.company = {}
      this.traffic_data = {}
      const one = {
        id: row.id,
        bid: row.comid
      }
      const { internship_user, company, internship } = await GetBaseInternshipInfo(one)
      this.internship_user = internship_user
      this.company = company
      this.traffic_data = internship
      this.preliminary = internship.preliminary
      this.Fstatus = internship.status_b
      if (internship.preliminary_at > 0) {
        this.traffic_data.preliminary_at = internship.preliminary_at * 1000
      }
      if (internship.status_at > 0) {
        this.traffic_data.status_at = internship.status_at * 1000
      }
      this.openDialog()
      this.getAttestModel()
    },
    // 获取审核模版
    async getAttestModel() {
      const one = { page: 1, limit: 100, type: 3 }
      const { list } = await GetAttestModel(one)
      this.modelList = list
    },
    customFilter(query) {
      this.inputValue = query
      this.filteredOptions = this.school.filter(option => {
        return option.name && option.name.toLowerCase().includes(query.toLowerCase())
      })
    },
    handleBlur() {
      // 当失去焦点时检查是否有匹配的选项
      const hasMatch = this.filteredOptions.some(option =>
        option.name && option.name.toLowerCase() === this.inputValue.toLowerCase()
      )
      if (!hasMatch) {
        this.handleNoMatch(this.inputValue)
      }
    },
    handleChange(val) {
      const selectedOption = this.school.find(option => option.id === val)
      if (selectedOption) {
        // 如果用户选择了一个选项，则更新输入框的值为选项的 name
        this.inputValue = selectedOption.name
      }
    },
    handleNoMatch(val) {
      this.formData.school = val
      // 这里添加你的逻辑，例如将输入的值保存到数据库，作为参数传递给API等
    },
    citydata() {
      this.getSchool(this.formData.province, this.formData.city)
    },
    // 获取省份
    getProvince() {
      province.RECORDS.forEach(item => {
        if (item.pid === 0) {
          this.provinceList.push(item)
        }
      })
    },
    // 监听下拉
    provincedata(data) {
      var cur = 0
      province.RECORDS.forEach(item => {
        if (item.fullname === data && item.pid === 0) {
          cur = item.cid
        }
      })
      this.city = []
      province.RECORDS.forEach(item => {
        if (item.pid === (cur / 1000)) {
          this.city.push(item)
        }
      })
      this.getSchool(this.formData.province, this.formData.city)
    },
    handleClick(e) {
      this.query.status = parseFloat(e)
      this.query.page = 1
      this.getInter()
    },
    // 获取学校列表
    async getSchool(province, city) {
      const one = {
        sub_name: province,
        phone: city,
        page: 1,
        limit: 1000
      }
      const { list } = await GetSchool(one)
      this.school = list
      this.filteredOptions = list
    },
    // 获取列表
    async getInter() {
      this.downloadLoading = true
      const { count, list } = await GetBaseInternship(this.query)
      this.count = count
      this.list = list
      this.downloadLoading = false
    },
    // 分页
    changPage(newPage) {
      this.query.page = newPage
      this.getInter()
    },
    // 打开新增编辑
    addRole(type, row) {
      if (type === 'edit') {
        this.getPracticeInfo(row)
        this.$refs.panel.show = !this.$refs.panel.show
      } else if (type === 'ren') {
        this.formData = row
        if (this.formData.end_at > 0) {
          this.formData.end_at = this.formData.end_at * 1000
        } else {
          this.formData.end_at = undefined
        }

        if (this.formData.start_at > 0) {
          this.formData.start_at = this.formData.start_at * 1000
        } else {
          this.formData.start_at = undefined
        }
        if (this.formData.province !== '') {
          var cur = 0
          province.RECORDS.forEach(item => {
            if (item.fullname === this.formData.province && item.pid === 0) {
              cur = item.cid
            }
          })
          this.city = []
          province.RECORDS.forEach(item => {
            if (item.pid === (cur / 1000)) {
              this.city.push(item)
            }
          })
          this.getSchool(this.formData.province, this.formData.city)
        }
        this.showDialog = true
      }
    },
    // 取消弹窗驳回
    btnCanleB() {
      this.content = ''
      this.showDialogB = false
    },

    // 搜索
    search() {
      this.query.page = 1
      this.getInter()
    },
    // 取消
    btnCanle() {
      this.formData = {
        comid: parseInt(user.state.userInfo.bid),
        city: '',
        id: undefined,
        full_name: '',
        province: '',
        school_type: 1,
        school: '',
        qualification: undefined,
        id_card_left: '',
        id_card_right: '',
        qualification_img: '',
        phone: '',
        bank: '',
        bank_no: '',
        bank_img: '',
        status: 2,
        status_img: '',
        start_at: undefined
      }
      this.$refs.idCardLeftPhoto.fileList = []
      this.$refs.idCardRightPhoto.fileList = []
      this.$refs.qualificationImgPhoto.fileList = []
      this.$refs.provePhoto.fileList = []
      this.showDialog = false
    },
    openDialogF() {
      if (this.formData.id_card_left) {
        const imgUrl = this.formData.id_card_left.split(',')
        const NewArr = []
        imgUrl.forEach(item => {
          const one = {
            url: item,
            upload: true
          }
          NewArr.push(one)
        })
        this.$refs.idCardLeftPhoto.fileList = NewArr
      } else {
        this.$refs.idCardLeftPhoto.fileList = []
      }
      if (this.formData.id_card_right) {
        const imgUrl = this.formData.id_card_right.split(',')
        const NewArr = []
        imgUrl.forEach(item => {
          const one = {
            url: item,
            upload: true
          }
          NewArr.push(one)
        })
        this.$refs.idCardRightPhoto.fileList = NewArr
      } else {
        this.$refs.idCardRightPhoto.fileList = []
      }
      if (this.formData.qualification_img) {
        const imgUrl = this.formData.qualification_img.split(',')
        const NewArr = []
        imgUrl.forEach(item => {
          const one = {
            url: item,
            upload: true
          }
          NewArr.push(one)
        })
        this.$refs.qualificationImgPhoto.fileList = NewArr
      } else {
        this.$refs.qualificationImgPhoto.fileList = []
      }
      if (this.formData.prove) {
        const imgUrl = this.formData.prove.split(',')
        const NewArr = []
        imgUrl.forEach(item => {
          const one = {
            url: item,
            upload: true
          }
          NewArr.push(one)
        })
        this.$refs.provePhoto.fileList = NewArr
      } else {
        this.$refs.provePhoto.fileList = []
      }
      if (this.formData.practice_img) {
        const imgUrl = this.formData.practice_img.split(',')
        const NewArr = []
        imgUrl.forEach(item => {
          const one = {
            url: item,
            upload: true
          }
          NewArr.push(one)
        })
        this.$refs.practice_img.fileList = NewArr
      } else {
        this.$refs.practice_img.fileList = []
      }
    },
    // 给图片赋值
    openDialog() {
      if (this.traffic_data.roster) {
        const imgUrl = this.traffic_data.roster.split(',')
        const NewArr = []
        imgUrl.forEach(item => {
          const one = {
            url: item,
            upload: true
          }
          NewArr.push(one)
        })
        this.$refs.roster.fileList = NewArr
      } else {
        this.$refs.roster.fileList = []
      }
    }
  }
}
</script>
<style scoped lang="scss">
.shopOrder-dialog{
  height: auto;
  max-height: 600px;
  overflow-y: auto;
}
.fujian-box{
  padding-bottom: 50px;
  label{
    font-size: 15px;
    font-weight: bold;
  }
  .item-xbox{
    flex-wrap: wrap;
  }
  .item-fujian{
    margin-top: 20px;
    margin-right: 10px;
    width: 14%;
    flex-direction: column;
    .item-img{
      width: 70%;
      img{
        width: 100%;
      }
    }
  }
  .item-title{
    font-size: 12px;
    text-align: center;
    margin-top: 10px;
  }
}
.base{
  padding: 20px 30px;
  display: flex;
  .logo{
    width: 118px;
    height: 118px;
    margin-right: 20px;
    background-color: #ebeef5;
    border: 1px solid #ebeef5;
    border-radius: 3px;
    img{
      width: 100%;
      height: 100%;
      border-radius: 3px;
    }
  }
  .info{
    flex: 1;
    .title{
      padding: 5px 0 18px;
      display: flex;
      .name{
        font-size: 20px;
        height: 20px;
        color: #303033;
        font-weight: 600;
        margin-right: 10px;
      }
      .user{
        padding-top: 6px;
        font-size: 14px;
        font-weight: 400;
        line-height: 14px;
        color: #777;
        .logoin{
          color: #0078ff;
          cursor: pointer;
        }
      }
      .qcc_box{
        width: 63px;
        height: 20px;
        position: absolute;
        right: 30px;
        z-index: 30;
        cursor: pointer;
        a{
          cursor: pointer;
          color: inherit;
          text-decoration: none;
          img{
            width: 100%;
            height: 100%;
          }
        }
      }
    }
    .details{
      max-width: 100%;
      .line{
        margin-bottom: 15px;
        .line_label{
          color: #777;
          font-size: 14px;
          line-height: 14px;
          font-weight: 400;
        }
        .text{
          display: inline-block;
          font-size: 14px;
          line-height: 14px;
        }
        .text_color{
          color: #0078ff;
          cursor: pointer;
        }
      }
    }
  }
}
.bind_icon{
  display: inline-block;
  float: left;
  margin-right: 5px;
}
.el-switch__label *{
      font-size: 11px;
    }
    .el-switch__label.is-active{
      color: #303033;
    }
.tab_box{
  padding:0 30px;
}
.clientInfo_wrapper{
  height: calc(100vh - 246px);
    overflow-y: auto;
}
.tables{
  padding: 20px 0px;
}
  .title_t{
    font-weight: 700;
    font-size: 16px;
    margin-left: 20px;
  }
  .table_content{
    margin-top: 30px;
  }
  .img_box{
    margin-top: 30px;
  }
  .btnOk-ljm{
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 30px;
  }
  .btnFoot{
    width: 100%;
    position:absolute;
    bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
</style>
